$(function () {
    let hc = $('.h_content');
    let pCounts = 0
    let i = 0;
    $.ajax({
        url: 'http://localhost:3000/personalized',
        data: {
            limit: 8
        },
        success: function (res) {
            let result = res.result;
            console.log(result);
            hc.html('');
            let i = 0;
            result.forEach((el, index) => {
                if (el.playCount > 100000) {
                    pCounts = (el.playCount / 10000).toFixed(0) + "万"
                } else {
                    pCounts = el.playCount
                }
                if (index === 3 || index === 5 || index === 7) {
                    hc.append(`<li class='dianTai${index}'>
                            </li>`)
                    $.ajax({
                        url: 'http://localhost:3000/personalized/djprogram',
                        success: function (res) {
                            if (res.result[i].program.adjustedPlayCount > 100000) {
                                pCounts = (res.result[i].program.adjustedPlayCount / 10000).toFixed(0) + "万"
                            } else {
                                pCounts = res.result[i].program.adjustedPlayCount
                            }
                            $(`.dianTai${index}`).append(`<div class="songD">
                            <a href="#">
                                <div class="msk_img"></div>
                                <img src="${res.result[i].picUrl}" alt="">
                            </a>
                            <div class="songD_bottom">
                                <div class="songD_bottom_con">
                                    <div class="songD_bottom_con_ep pull-left">
                                        <div class="songD_bottom_con_ep_icon pull-left"></div>
                                        <p class="nb pull-left">${pCounts}</p>
                                    </div>
                                    <div class="songD_bottom_con_play pull-right">
                                        <a href="#"></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <a href="#" class="radioA">
                            <i class="radio show"></i>
                            <p class="song_desc radioP">
                                ${res.result[i].name}
                            </p>
                        </a>`);
                            i++;
                        }
                    })
                } else {

                    hc.append(`<li data-index=${index}>
                    <div class="songD">
                        <a href="../../views/playlistDetail.html?id=${el.id}">
                            <div class="msk_img"></div>
                            <img src="${el.picUrl}" alt="">
                        </a>
                        <div class="songD_bottom">
                            <div class="songD_bottom_con">
                                <div class="songD_bottom_con_ep pull-left">
                                    <div class="songD_bottom_con_ep_icon pull-left"></div>
                                    <p class="nb pull-left">${pCounts}</p>
                                </div>
                                <div class="songD_bottom_con_play pull-right">
                                    <a href="#"></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <a href="../../views/playlistDetail.html?id=${el.id}">
                        <p class="song_desc">
                            ${el.name}
                        </p>
                    </a>
                </li>`)
                }

            });

        }
    })
})